<%@ page contentType="text/html; charset=UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<%@taglib prefix="h" uri="/syzg-html"%>
<%@ taglib prefix="security" uri="http://www.enersun.com.cn/security"%>

<% 
	String realPath = request.getContextPath()+ "/";  
%>
<!DOCTYPE html>
<html>
	<head>
	<style>
	.input-stime {
		  height: 30px;
		  padding: 5px 10px;
		  font-size: 12px;
		  line-height: 1.5;
		  border-radius: 0px;
		  border-color: #d2d6de;
		}
	</style>
		<%@ include file="/base/jsp/common/CommonListTop.jsp"%>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
		<title>[菜单名(或大模块名)-模块名]</title>
		<link href="${ctx}/base/css/common.css" rel="stylesheet" type="text/css" />
		<link href="${ctx}/base/css/${customTheme}.css" rel="stylesheet" type="text/css" />
		<script src="${ctx}/base/js/base.js" type="text/javascript"></script>
		<script src="${ctx}/base/js/common/FormFunction.js" type="text/javascript"></script>
		<script src="${ctx}/baseNew/plugins/jQuery/jQuery-2.2.0.min.js"></script>
		<link href="${ctx}/baseNew/bootstrap/css/bootstrap.min.css" rel="stylesheet">
		<script src="${ctx}/baseNew/bootstrap/js/bootstrap.js" type="text/javascript"></script>
    	<link href="${ctx}/baseNew/other/css/bootstrap-datetimepicker.min.css" rel="stylesheet" media="screen">
		<script src="${ctx}/baseNew/other/js/bootstrap-datetimepicker.js" type="text/javascript"></script>
		<script src="${ctx}/baseNew/other/js/locales/bootstrap-datetimepicker.zh-CN.js" type="text/javascript"></script>
		<link rel="stylesheet" href="${ctx}/baseNew/dist/css/AdminLTE.min.css">
  		<script src="${ctx}/baseNew/other/js/bootbox.min.js" type="text/javascript"></script>
  		<link rel="stylesheet" href="${ctx}/baseNew/validator/css/bootstrapValidator.css"/>
		<script type="text/javascript" src="${ctx}/baseNew/validator/js/bootstrapValidator.js"></script>
		<script type="text/javascript" src="${ctx}/zenithsun/js/ModalUtil.js"></script>
		<link href="${ctx}/base/imgsel/css/style.css" rel="stylesheet" type="text/css" />
		<link rel="stylesheet" href="${ctx}/zenithsun/css/admin-imgList.css"/>
		<script src="${ctx}/zenithsun/pic/picsubject/js/sharePicSubject.js" type="text/javascript"></script>
		<!-- 公用的按钮函数 -->
		<script>
			var viewUrl = "${ctx}/path/picsubject/viewPicsubject";//表单列表view的url地址
			var listUrl = "${ctx}/path/picsubject/listPicsubject";//表单列表list 的url地址,用来作为搜索地址
			var realPath="${ctx}";
			//动态加载
			$(function () {
				doLoadPicSubject();
				//绑定回车搜索
				$("#searchValue_title").keyup(function(){
					if(event.keyCode==13){
						doLoadPicSubject();
					}
				});
	    	});
	    	
			function defaultEent(eventType,width,height) {
				doLoadPicSubject();
			}
			
			function mve(obj){
				$(obj).find(".j-popShow").show();
			}
			//此为图片列表鼠标经过时删除事件
			function mot(obj){
				$(obj).find(".j-popShow").hide();
			}
			
			/* $(".j-popShow").click(function(){
				mck($(this));
			}); */
			//此为图片列表鼠标经过时点击选中事件
			function mck(obj){
				//$(obj).find("div").toggleClass('selected');
				var objBtn = $(obj).siblings().find(".j-selectId");
				var objBtnVal = objBtn.val();
				if(objBtnVal=="true"){
					objBtn.val(false);
					$(obj).parents("li").removeClass('selected');
		    		$(obj).parents(".select").removeClass('selected');
				} else if(objBtnVal=="false") {
					objBtn.val(true);
					if ($(obj).parents("li.selected").length == 0) {
					    $(obj).parents("li").addClass('selected');
					    $(obj).parents(".select").addClass('selected');
					}
				}
				//counter();
				//alert(checkItem.id+":"+checkItem.checked);
			}
			function listPicdetail(picsubjectId){
				ModalUtil.showModal('myDlg','${ctx}/path/picdetail/listPicdetail?picsubjectId='+picsubjectId,'listPicDetailModal');
			}
			function noImage(t){
				t.src="${ctx}/zenithsun/news/mobile/images/Default-bg270x180.png"; 
				t.onerror=null;
			}
			
			function downloadPictures(picsubjectId){
				location.href="${ctx}/path/picdetail/downPictures?picsubjectId="+picsubjectId;
			}
			
			//获取查询参数
			function getParamData(){
				var title=$("#searchValue_title").val();
				var year=$('#yearSelect option:selected').val();
				var month=$('#monthSelect option:selected').val();
				if(title==undefined)
				{
					title='';
				}
				return {"pageNo":pageNo,"limit":limit,"name":title,"year":year,"month":month};
			}
		</script>
	</head>

	<body class="rightBody">
		<div class="form-inline">
			<table width="100%" class="title" border="0" cellspacing="0" cellpadding="0">
				<tr>
				  <th>
				    <img src="${ctx}/zenithsun/images/back.png" width="26" height="26" alt="图标 " class="icon" />
					<em class="headTips">图片资源库管理</em> &gt; 共享图片库
				  </th>
				  <th width="200"></th>
				</tr>
				<tr>
				  <td>
				    <div class="form-group">
					  <label class="control-label sr-only" for="searchValue_'title'_">图集名称</label>
					  <input type="text" name="searchValue['title']" id="searchValue_title" class="form-control input-sm" placeholder="名称、描述、摄影者"/>
					 <jsp:useBean id="date" class="java.util.Date"/> 
					  <select id='yearSelect' class="input-stime">
					  	  <option value="" selected = "selected">请选择摄影年份</option>
					  	  <fmt:formatDate var="currYear" value="${date }" pattern="yyyy"/> 
						  <c:forEach var="year" begin="2008" end="${currYear }">
						  	<option value="${year }">${year }年</option>
						  </c:forEach>
					  </select>
					  <select id='monthSelect' class="input-stime">
					  	  <option value='' selected = "selected">请选择摄影月份</option>
					  	  <option value='01'>1月</option>
					  	  <option value='02'>2月</option>
					  	  <option value='03'>3月</option>
					  	  <option value='04'>4月</option>
					  	  <option value='05'>5月</option>
					  	  <option value='06'>6月</option>
					  	  <option value='07'>7月</option>
					  	  <option value='08'>8月</option>
					  	  <option value='09'>9月</option>
					  	  <option value='10'>10月</option>
					  	  <option value='11'>11月</option>
					  	  <option value='12'>12月</option>
					  </select>
					  <button type="button" class="btn btn-primary btn-sm" onclick="defaultEent('search')">搜索</button>
				    </div>
				  </td>
				  <td align="right">
				  </td>
				</tr>
			</table>
		</div>
		<div class="picList js-listEdit">
			  <ul class="mod-itemsLi clearfix" id="PIC-LIST">
			  
			  	<li id="lastRow" style="display: none;"></li>
			  </ul>
			</div>
			<div id="PIC-TEMPLATE" style="display:none; ">
				 <li id="li-%id%" onmousemove="mve(this)" onmouseout="mot(this)" style="width: 285px;height: 300px;" class="">
						    <dl>
						  	<dt class="mod-itemsTitle">
						  		<h3>%name%</h3><!-- &nbsp;&nbsp;&nbsp;&nbsp;<a style="font-size: 16px;" href="${ctx}/path/picdetail/listPicdetail?picsubjectId=%id%" title="图片列表">图片列表</a> --> 
						  		<p class="mod-itemsTitle-decsr clearfix">
						  			<span class="fn-fr">%createTime%</span>
						  			&nbsp;&nbsp;
						  			<span class="glyphicon fn-fl">浏览：%view%&nbsp;下载：%down%</span>
						  		</p>
						  	</dt>
						    <dd class="mod-itemsContent">
						      <div id="div_%id% }">
						      	<img src="${ctx }%coverPath%" id="cover_%id%" style="width: 265px;height: 175px;">
						      	<em class="mod-itemsNum">%picNum%</em>
						      </div>
						      <div class="mod-itemContent-info">
						      		%remark%
						      </div>
							  <div name="liSelectItem" class="picList-editGrid-wrap j-popShow" onclick="mck(this)"></div>
						      <div class="picList-editGrid j-popShow" style="display: block;">
						        <input type="hidden" id="%id%" class="j-selectId" name="selectedRow" value="false">
						        <a class="i-edit2-btn" href="javascript:FormFunction.showViewModal('%id%')" title="查看主题"><i class="fa fa-info"></i> </a> 
					        	<a class="i-search2-btn" href="${ctx}/path/picdetail/listPicdetail?picsubjectId=%id%&share=true" title="查看图集"><i class="fa fa-search"></i> </a>
					        	%download%
						      </div>
						    </dd>
						  </dl>
						</li>
			</div>
			<div class="pagnation" id="pagnation"></div>
		<div id="myDlg"></div>
		<%@ include file="/base/jsp/common/CommonListFoot.jsp"%>
		<script src="${ctx}/base/imgsel/js/img.js" type="text/javascript"></script>
	</body>
</html>